Component の描画に必要なデータは Component 自身が要求する

少し話が逸れるけど、CSS については「Component と CSS は対として自己完結した管理をすべき」はもう何年も前から当たり前として認知されていると思う。これと同じように、データ取得についても中央集権ではなく自律分散させたいのだ。

RSC における「Server Component がネイティブに非同期処理を行ってよい」が、自律分散なデータ取得を求める身にとって福音となるのは当然の帰結だ。Component が個々にデータ取得を行うので、バックエンド呼び出しと React のレンダリングが同時に動いていく。

こうしておけば、子 Component 部分の再利用性も確保できるし、「やっぱりこの部分表示してても売上に繋がらないから捨てよう」となったときの Disposability も高い。

こうなってくると、バックエンド API に求めるものは「ページを描画するための全情報を返す API」ではなく「Component を描画するための情報を返す API」になってくる。冒頭に貼った X の投稿はこれを意図したものである。